<template>
  <div>
    <ul>
      <li v-for="(node, index) in menuItems" :key="index">
		<span @click="toggle(node)">{{ node.name }}</span>  
        <!-- <router-link :to="item.path">{{ item.name }}</router-link> -->
        <menu-item v-if="node.children && node.show" :menu-items="node.children"></menu-item>
      </li>
    </ul>
  </div>
  
  
  <!-- <view>{{age}}</view> -->
</template>

<!-- <template>
  <div class="tree">
    <li v-for="node in menuItems" :key="node.id">
      <span @click="toggle(node)">{{ node.name }}</span>
      <ul v-if="node.children && node.show">
        
		<menu-item :menu-items="node.children"></menu-item>
		
      </ul>
    </li>
  </div>-->


<!-- <li v-for="childNode in node.children" :key="childNode.id">
  <span @click="toggle(childNode)">{{ childNode.name }}</span>
</li> -->

<!-- <menu-item v-if="node.children" :menu-items="node.children"></menu-item> -->
 
<script>
	// import MenuItem from './MenuItem.vue';
	
	
export default {
  // name: 'MenuItem',
  // components: {
  //     MenuItem,
  // },
  
  
  props: {
		menuItems:{
		    type:Array,
		    required:true,
		},
		
		// age: {
		// 	type: Number,
		// 	default: 0,
		// 	required: true,
		// 	validator: function(value) {
		// 		return value >= 0
		// 	}
		// }
	},
	
	 methods: {
	 	toggle(node) {
	 		// alert("1==="+ node);
	 		
	 	  node.show = !node.show;
	 	  // this.$emit('toggle', node);
	 	},
	 },
  
  // components: {
  //   MenuItem: {
  //     props: ['menuItems'],
	 //  methods: {
	 //  	toggle(node) {
	 //  		alert("1==="+ node);
	  		
	 //  	  node.show = !node.show;
	 //  	  // this.$emit('toggle', node);
	 //  	},
	 //  },
	 //  computed:{
		  
	 //  }
  //     // template: `
  //     //   <ul>
  //     //     <li v-for="(item, index) in menuItems" :key="index">
  //     //       <router-link :to="item.path">{{ item.name }}</router-link>
  //     //       <menu-item v-if="item.children" :menu-items="item.children"></menu-item>
  //     //     </li>
  //     //   </ul>
  //     // `
  //   }
  // }
};
</script>